<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Role</title>
    <link rel="stylesheet" type="text/css" href="__STATIC__/plugins/layui/css/layui.css">
    <script type="text/javascript" src="__STATIC__/plugins/layui/layui.js"></script>

    <style type="text/css">
        .header span{background: #009688;margin-left: 30px;padding: 10px;color:#ffffff;}
        .header div{border-bottom: solid 2px #009688;margin-top: 8px;}
    </style>
</head>
<body style="padding: 10px;">
    <div class="header">
        <span>角色管理</span>
        <button class="layui-btn layui-btn-xs" style="float: right;" onclick="add()">添加</button>
        <div></div>
    </div>

<!--<form class="layui-form">-->

    <table class="layui-table">
        <thead>
        <tr>
            <th>ID</th>
            <td>角色</td>
            <td>编辑</td>
        </tr>
        </thead>
        <tbody>
        {volist name="data.roles" id="vo"}
        <tr>
            <td>{$vo.gid}</td>
            <td>{$vo.title}</td>
            <td>
                <button class="layui-btn layui-btn-warm layui-btn-xs" onclick="add({$vo.gid})">编辑</button>
                <button class="layui-btn layui-btn-danger layui-btn-xs" onclick="del({$vo.gid})">删除</button>
            </td>
        </tr>
        {/volist}
        </tbody>
    </table>
<!--</form>-->
<script type="text/javascript">
    layui.use(['layer','form'],function(){
        $ = layui.jquery;
        layer = layui.layer;
    });

    // 编辑和新增
    function add(gid) {
        layer.open({
            type: 2,
            title: gid>0?'编辑角色':'添加角色',
            shade: 0.3,
            area: ['780px', '520px'],
            content: "{:url('admins/Roles/add')}?gid="+gid
        });
    }

    // 删除
    function del(gid){
        layer.confirm('确定要删除吗？', {
            icon:3,
            btn: ['确定','取消']
        }, function(){
            $.post('/admins.php/admins/roles/deletes',{'gid':gid},function(res){
                if(res.code>0){
                    layer.alert(res.msg,{icon:2});
                }else{
                    layer.msg(res.msg);
                    setTimeout(function(){window.location.reload();},1000);
                }
            },'json');
        });
    }
</script>
</body>
</html>